
.main{
  flex: 1 1 70%;
  border-radius: 15px;
  background-color: rgba(255, 255, 255, .1);
  //margin-bottom: 1rem;
  //padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  //margin-top: 5rem;
  //justify-content: center;

  .title{
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 3rem;
    margin-top: 2rem;
    letter-spacing: .4rem;
  }
}


.form{
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 3.5rem;
  //margin-top: 5rem;
  & .input{
    position: absolute;
    background: none;
    border: none;
    height: 2.5rem;
    width: 25rem;
    font-size: 1.2rem;
    color: white;
    //border-bottom: 2px solid rgba(255, 255, 255, .1)

  }
  //& input:focus + label{
  //  display: none;
  //  background-color: burlywood;
  //}
  & .item{
    margin-bottom: .8rem;
    position: relative;
    display: flex;
    height: 3rem;
    width: 25rem;
    border-bottom: 2px solid rgba(255, 255, 255, .1)
  }
  & .icon{
    position: absolute;
    right: .2rem;
    bottom: .8rem;
    pointer-events: none;
  }
  & .label{
    position: absolute;
    bottom: .8rem;
    left: .2rem;
    pointer-events: none;
    display: none;
  }
  & .checkbox{
    margin-bottom: 1rem;
  }
  & .button{
    border-radius: 15px;
    height: 3rem;
    font-size: 1.5rem;
    border: none;
    background-color: white;
    margin-top: 2rem;
    cursor: pointer;
  }
  & .remember{
    font-weight: 200;
    font-size: 1rem;
    margin-left: .5rem;
  }
  & .register{
  }
  & .link{}
}

